<h1>
	Utilities
</h1>

<div id="js-augmentation" class="sect">
	<h2>
		关于辅助函数
	</h2>
	<p>
		Ext提供了增强Javascript与JSON若干方面的函数，功能上各自不一样但目的都是为了更方便地程序员使用好前端设施。
	</p>
</div>

<div id="util-apply" class="sect">
	<h2>
		apply 和 applyIf
	</h2>
	<p>
		<ul>
			<!-- Begin apply -->
			<li>
				<b>apply</b>
				<div>
					复制一个JavaScript对象的所有属性至obj，第一个参数为属性接受方对象，第二个参数为属性源对象。注意即使目的对象都有同名属性，也会被覆盖。
					<br />
					<br />
					<pre>
var person = {
    name: <span class="string">'John Smith'</span>,
    age: 30
};

Ext.apply(person, {
    hobby: <span class="string">'Coding'</span>,
    city: <span class="string">'London'</span>
}); <span class="comment">// person对象也有hobby与city</span>
</pre>
				</div>
			</li>
			<!-- End apply -->

			<!-- Begin applyIf -->
			<li>
				<b>applyIf</b>
				<div>
					与apply相类似。不同的是目的对象有同名属性就会跳过，不会被覆盖，以目标对象的属性较为优先。

					<br />
					<br />
					<pre>
var person = {
    name: <span class="string">'John Smith'</span>,
    age: 30,
    hobby: <span class="string">'Rock Band'</span>
};

Ext.applyIf(person, {
    hobby: <span class="string">'Coding'</span>,
    city: <span class="string">'London'</span>
}); <span class="comment">//不复制hobby</span>
</pre>
				</div>
			</li>
			<!-- End applyIf -->
		</ul>
	</p>
</div>

<div id="util-urlencode" class="sect">
	<h2>
		Url Encoding/Decoding
	</h2>
	<p>
		这些方法用于JSON数据的转换，在GET的http通讯中经常被转换为字符通讯等等的场景。
		<ul>
			<!-- Begin urlEncode -->
			<li>
				<b>urlEncode</b>
				<div>
					把一个对象转换为一串以编码的URL字符。例如Ext.urlEncode({foo: 1, bar:
					2});变为&quot;foo=1&amp;bar=2&quot;。可选地，如果遇到属性的类型是数组的话，那么该属性对应的key就是每个数组元素的key，逐一进行“结对的”编码。

					<br />
					<br />
					<pre>
var params = {
    foo: <span class="string">'value1'</span>,
    bar: 100
};

var s = Ext.encode(params); <span class="comment">// s形如foo=value1&amp;bar=100</span>
</pre>
				</div>
			</li>
			<!-- End urlEncode -->

			<!-- Begin urlDecode -->
			<li>
				<b>urlDecode</b>
				<div>
					把一个已经encoded的URL字符串转换为对象。如Ext.urlDecode(&quot;foo=1&amp;bar=2&quot;);
					就是{foo: &quot;1&quot;, bar: &quot;2&quot;}。
					<br />
					<br />
					<pre>
var s = <span class="string">'foo=value1&bar=100'</span>;
var o = Ext.decode(s); <span class="comment">// o现在有两个属性，foo和bar。</span>
alert(o.bar);
</pre>
				</div>
			</li>
			<!-- End urlDecode -->
		</ul>
	</p>
</div>

<div id="util-array" class="sect">
	<h2>
		数组
	</h2>
	<p>
		The core provides methods for working with arrays and other
		collections within Javascript.
		<ul>
			<!-- Begin each -->
			<li>
				<b>each</b>
				<div>
					迭代一个数组，包括Nodelists或CompositeElements，数组中每个成员都将调用一次所传函数，直到函数返回false才停止执行。

					<br />
					<br />
					<pre>
Ext.each([1, 2, 3, 4, 5], function(num){
    alert(num);
});
</pre>
				</div>
			</li>
			<!-- End each -->

			<!-- Begin toArray -->
			<li>
				<b>toArray</b>
				<div>
					将可以迭代的集合（collection）转换为相当的JavaScript数组。
					<br />
					<br />
					<pre>
var arr1 = Ext.toArray(1); <span class="comment">// arr1 = [1];</span>
<span class="comment">// arr2 now contains an array of Ext elements.</span>
var arr2 = Ext.toArray(Ext.select('div)); 
</pre>
				</div>
			</li>
			<!-- End toArray -->
		</ul>
	</p>
</div>

<div id="util-json" class="sect">
	<h2>
		JSON
	</h2>
	<p>
		JSON表示Javascript Object Notation，常用于数据交换格式。类似于JavaScript的字面对象（object
		literals）。当与服务器交换数据的时候，就要转换为原生的JavaScript形式。有以下两种辅助方法。更多的资讯可参见
		<a href="http://json.org">json.org</A>。
	<ul>
		<!-- Begin encode -->
		<li>
			<b>encode</b>
			<div>
				对一个对象，数组，或是其它值编码，转换为适合外界使用的格式。

				<br />
				<br />
				<pre>
var s = Ext.encode({
    foo: 1,
    bar: 2
}); <span class="comment">//s是<span class=string>'{foo=1,bar=2}'这样。</span>
						</span>
</pre>
			</div>
		</li>
		<!-- End encode -->

		<!-- Begin decode -->
		<li>
			<b>decode</b>
			<div>
				对应着encode,decode是将JSON字符串解码（解析）成为JavaScript对象。在接受Ajax响应的前期步骤中就会经常使用这个方法处理文本变为JavaScript对象。

				<br />
				<br />
				<pre>
var s = <span class="string">'{foo=1,bar=2}'</span>;
var o = Ext.decode(s); <span class="comment">o现在有两个属性，foo和bar。</span>
</pre>
			</div>
		</li>
		<!-- End decode -->
	</ul>
	</p>
</div>

<style type="text/css">
li.list {
	list-style: disc outside;
	margin-left: 20px;
}
</style>
<div id="util-detection" class="sect">
	<h2>
		浏览器与OS的判定
	</h2>

	<h3>
		JavaScript
	</h3>
	<p>
		Ext带有一系列的浏览器判定的功能，以解决主流浏览器之间有差异的问题，在JavaScript与CSS方面都有判定技术，也适应复杂的情境。

		<br />
		<br />

		对浏览器的判定情况:
		<ul>
			<li class="list">
				<span class="string">Internet Explorer - Ext.isIE, Ext.isIE6,
					Ext.isIE7, Ext.isIE8</span>
			</li>
			<li class="list">
				Firefox - Ext.isGecko, Ext.isGecko2, Ext.isGecko3
			</li>
			<li class="list">
				Opera - Ext.isOpera
			</li>
			<li class="list">
				Chrome - Ext.isChrome
			</li>
			<li class="list">
				Safari - Ext.isSafari, Ext.isSafari2, Ext.isSafari3
			</li>
			<li class="list">
				WebKit - Ext.isWebKit
			</li>
			<li class="list">
				Operating Systems - Ext.isLinux, Ext.isWindows, Ext.isMac
			</li>
		</ul>
		<pre>
if(Ext.isIE){
    <span class="comment">//  执行该浏览器的专用代码</span>
}
</pre>
	</p>
	<h3>
		CSS
	</h3>
	<p>
		CSS也有类似的判定，不同的样式会根据不同的操作环境适当添加到根元素和body上，目的是更方便地解决好浏览器怪辟问题。在strict模式环境中，样式ext-strict就会加入到root，其余这些可适当地加入到body中去。

		<ul>
			<li>
				.ext-ie, .ext-ie6, .ext-ie7, .ext-ie8
			</li>
			<li>
				.ext-gecko, .ext-gecko2, .ext-gecko3
			</li>
			<li>
				.ext-opera
			</li>
			<li>
				.ext-safari
			</li>
			<li>
				.ext-chrome
			</li>
			<li>
				.ext-mac, .ext-linux
			</li>
		</ul>
		<pre>
<span class="comment">/* 当这是strict mode模式而且是safari的环境中，字体便有变化。 */</span>
.ext-strict .ext-safari .sample-item{
    font-size: 20px; 
}
</pre>
	</p>
</div>

<div id="util-type" class="sect">
	<h2>
		类型判定
	</h2>
	<p>
		JavaScript是一门弱类型语言，要搞清楚变量是什么类型自然很有必要。这方面，Ext有若干如下的方法：

		<ul>
			<!-- Begin isEmpty -->
			<li>
				<b>isEmpty</b>
				<div>
					如果传入的值是null、undefined或空字符串，则返回true。
					<br />
					<br />
					<pre>
alert(Ext.isEmpty(<span class="string">''</span>));
</pre>
				</div>
			</li>
			<!-- End isEmpty -->

			<!-- Begin isArray -->
			<li>
				<b>isArray</b>
				<div>
					返回true表名送入的对象是JavaScript的array类型对象，否则为false。
					<br />
					<br />
					<pre>
alert(Ext.isArray([1, 2, 3]));
</pre>
				</div>
			</li>
			<!-- End isArray -->

			<!-- Begin isObject -->
			<li>
				<b>isObject</b>
				<div>
					检查传入的值是否为对象。
					<br />
					<br />
					<pre>
alert(Ext.isObject({}));
</pre>
				</div>
			</li>
			<!-- End isObject -->

			<!-- Begin isFunction -->
			<li>
				<b>isFunction</b>
				<div>
					检查传入的值是否为函数。
					<br />
					<br />
					<pre>
alert(Ext.isFunction(function(){
}));
</pre>
				</div>
			</li>
			<!-- End isFunction -->
		</ul>
	</p>
</div>

<div id="util-misc" class="sect">
	<h2>
		杂项
	</h2>
	<p>
		<ul>
			<!-- Begin id -->
			<li>
				<b>id</b>
				<div>
					返回一个独一无二的标点符号，对Ext.id()的调用就是生成从未使用的新id，第一个参数是可选的，是对哪个元素去分配id，第二个参数是id的前缀。

					<br />
					<br />
					<pre>
var s = Ext.id(null, <span class="string">'prefix'</span>); <span
							class="comment">// No element specified here</span>
var s = Ext.id(Ext.get(document.body)); <span class="comment">// Assign the id to an element</span>
</pre>
				</div>
			</li>
			<!-- End id -->
		</ul>
	</p>
</div>



